// Copyright (C) 2017 Nokia

/* You can add global styles to this file, and also import other style files */
@import "styles/colors";
@import "styles/modals";
@import "styles/badges";
@import "styles/codemirror";
@import "styles/scrollbars";
@import "styles/animation";
@import "styles/jsPlumb";
@import "styles/zoom";
@import "styles/search";

/* Bootstrap */
@import "../node_modules/bootstrap-css-only/css/bootstrap.min.css";

/* Font Awesome */
$fa-font-path: "../node_modules/font-awesome/fonts";
@import "../node_modules/font-awesome/scss/font-awesome.scss";

/* Open Sans */
@import "../node_modules/open-sans-fontface/open-sans.css";

/* sweetalert */
@import "../node_modules/sweetalert2/dist/sweetalert2.min.css";
@import "styles/_alerts.scss";

/* awesome checkbox */
@import "../node_modules/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css";

html {
  font-size: 14px;
}

body {
  background-color: $background-color;
  overflow: hidden;
  // override bootstrap's font-family definitions
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, Roboto, sans-serif;

  /*background-image: url(assets/mistral.png);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-blend-mode: soft-light;*/
}

html, body, cf-root {
  height: 100vh;
}


/***********
*** misc ***
************/
.bg-primary {
  background-color: $bg-primary2 !important;
}

.bg-white {
  background: #fff !important;
}

.btn-light {
  // bootstrap btn-light is too light
  background-color: #e9e9e9;
  border-color: #e9e9e9;
  &.btn-light:focus {
    box-shadow: 0 0 0 3px rgba(195, 195, 195, 0.5);
  }
}

.text-muted2 {
  color: $text-muted2;
}

.pointer {
  cursor: pointer;
}

.card-shadow {
  box-shadow: 0 2px 2px rgba(0,0,0,.16);
}

.header-shadow {
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.24);
}

.word-break-word {
  word-wrap: break-word;
}

.word-break-all {
  word-break: break-all;
}

.text-ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

pre {
  white-space: pre-wrap;
  @extend .word-break-all;
}

.flex-1 {
  flex: 1;
}

.flex-1-1-auto {
  flex: 1 1 auto;
}

.flex-0-0-15 {
  flex: 0 0 15%;
}

.flex-1-1-0 {
  flex: 1 1 0;
}

.flex-1-1-33 {
  flex: 1 1 33%;
}

.flex-center {
  text-align: center;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.mnw-0 {
  min-width: 0;
}

.h-0 {
  height: 0 !important;
}

// reset tooltip font size
ngb-tooltip-window.tooltip.show {
  font-size: 1rem;
}

.copy-to-clipboard-header {
  color: #999;
  background-color: #ebebeb;
}

div[role="tab"].card-header {
  .card-header-content:after {
    content: "\f078"; // fa-chevron-down
    font-family: FontAwesome;
  }

  &.active .card-header-content:after {
    content: "\f077"; // fa-chevron-up
    font-family: FontAwesome;
  }

  h5 > button {
    padding: 0;
    width: 100%;
  }
}

/***************************
*** show on parent hover ***
****************************/
.show-on-hover-parent {
  .show-on-hover {
    transition: opacity .2s;
  }

  & .show-on-hover {
    opacity: 0;
  }
  &:hover .show-on-hover {
    opacity: 1;
  }
}

/**********************
*** Labeled buttons ***
***********************/
button.btn-labeled {
  position: relative;
  padding-left: 3em;

  i {
    background: rgba(0,0,0,.05);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    line-height: 1;
    width: 2.5em;
    padding: .5em;
  }
}
